<template>
	<view class="main-container">
		<view class="s-p-t">
			1. 容器 
		</view>
			
		<view class="s-p-h" @click="naviTo('view')"><text>视图 view</text></view>
		<view class="s-p-h" @click="naviTo('scoll')"><text>滚动视图 scroll-view</text></view>
		<view class="s-p-h" @click="naviTo('swiper')"><text>可滑动视图 swiper</text></view>

		<view class="s-p-t">
			2. 基础内容 
		</view>
			
		<view class="s-p-h" @click="naviTo('text')"><text>文本 text</text></view>
		<view class="s-p-h" @click="naviTo('rich')"><text>富文本 rich-text</text></view>
		<view class="s-p-h" @click="naviTo('progress')"><text>进度条 progress</text></view>

		<!-- 3. 表单组件 -->
		<view class="s-p-t">
			<text class="item-title">
				3. 表单组件
			</text>
		</view>
		
		<!-- 【添加这里】 -->
		<view class="s-p-h" @click="naviTo('button')">
			<text>1. button</text>
		</view>
		<view class="s-p-h" @click="naviTo('radio')">
			<text>2. radio</text>
		</view>
		<view class="s-p-h" @click="naviTo('checkbox')">
			<text>3. checkbox</text>
		</view>
		<view class="s-p-h" @click="naviTo('input')">
			<text>4. input</text>
		</view>
		<view class="s-p-h" @click="naviTo('picker')">
			<text>5. picker</text>
		</view>
		
		<view class="s-p-h" @click="naviTo('slider')">
			<text>6. slider</text>
		</view>
		<view class="s-p-h" @click="naviTo('switch')">
			<text>7. switch</text>
		</view>
		<view class="s-p-h" @click="naviTo('textarea')">
			<text>8. textarea</text>
		</view>
		<view class="s-p-h" @click="naviTo('form')">
			<text>9. form</text>
		</view>
		
		<view class="s-p-t">
			<text class="item-title">
				4. 高级组件
			</text>
		</view>
		
		<!-- 【添加这里】 -->
		<view class="s-p-h" @click="naviTo('navigator')">
			<text>1. navigator</text>
		</view>
		
		<view class="s-p-h" @click="naviTo('image')">
			<text>2. image</text>
		</view>
		
		<view class="s-p-h" @click="naviTo('video')">
			<text>3. video</text>
		</view>
		
		<view class="s-p-h" @click="naviTo('map')">
			<text>4. map</text>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
			}
		},
		methods: {
			naviTo(e){
				uni.navigateTo({
					url: "/pages/components/" + e + "/" + e
				})
			}
		}
	}
</script>

<style>
@import '../../../static/css/smart.css';
</style>
